.self-checking-container {
    width: 100%;
    height: 100%; 
    padding: 0.32rem 0.32rem 0.95rem 0.32rem;
    box-sizing: border-box;
    overflow-y: auto;
    position: fixed; 
    background: url(../img/bg.png) no-repeat 0 0;
    background-size: cover;}
    .self-checking-container .self-checking-head {
        font-size: 0.4rem;
        font-weight:400;
        color:rgba(255,255,255,1);
        position: relative; }
        .self-checking-container .self-checking-pre {
            width: 13px;
            height: 13px;
            position: absolute;
            top: 50%;
            left: 4px;
            z-index: 99;
            color: rgba(0, 0, 0, 0);
            border-top: 1px solid #fff;
            border-left: 1px solid #fff;
            transform: translateY(-50%) rotate(-45deg);}
        .self-checking-container .self-checking-head .self-checking-num {
            padding: 0 0.72rem;
            text-align: center;
            line-height: 0.5rem; }
    .self-checking-container .self-checking-con {
        /* background: #fff; */
        max-width: 100%;
        height: 6rem;
        position: relative;
        top: 40%;
        transform: translateY(-60%);
        border-radius: 5px; }
        
        .poster-item {
            max-width: 100%;
            position: absolute;
            top: 0;
            background: #fff;
            border-radius: 5px;
            box-shadow: 1px 1px 4px #888888;
            overflow: hidden; }
            .poster-item .poster-num {
                font-size: 0.6rem;
                padding: 0.6rem 0 0 0.4rem;
                box-sizing: border-box; }
            .poster-item .poster-title {
                font-size: 0.6rem;
                height: 5rem;
                padding: 0.6rem 0.6rem 0.92rem;
                box-sizing: border-box; }

    .self-checking-btn {
        width: 90%;
        height: 1.5rem;
        border: 1px solid #ccc;
        border-radius: 0.2rem;
        position: absolute;
        left: 50%;
        transform: translateX(-50%);
        bottom: 0.4rem;
        color: #fff;
        font-size: 0.6rem;
        text-align: center;
        line-height: 1.5rem;
    }


    .poster-item:nth-child(1) {
        -webkit-transform: scale(1) translate3d(0, 0, 0)!important;
        -moz-transform: scale(1) translate3d(0, 0, 0)!important;
        -ms-transform: scale(1) translate3d(0, 0, 0)!important;
        transform: scale(1) translate3d(0, 0, 0)!important;
        z-index: 99!important;
        top: 0px!important;
        opacity: 1!important;
    }
    .poster-item:nth-child(2) {
        -webkit-transform: scale(0.96) translate3d(0, 0, 0)!important;
        -moz-transform: scale(0.96) translate3d(0, 0, 0)!important;
        -ms-transform: scale(0.96) translate3d(0, 0, 0)!important;
        transform: scale(0.96) translate3d(0, 0, 0)!important;
        z-index: 98!important;
        top: 15px!important;
        opacity: 0.92!important;
    }
    .poster-item:nth-child(3) {
        -webkit-transform: scale(0.92) translate3d(0, 0, 0)!important;
        -moz-transform: scale(0.92) translate3d(0, 0, 0)!important;
        -ms-transform: scale(0.92) translate3d(0, 0, 0)!important;
        transform: scale(0.92) translate3d(0, 0, 0)!important;
        z-index: 97!important;
        top: 30px!important;
        opacity: 0.84!important;
    }
    .poster-item:nth-child(4) {
        -webkit-transform: scale(0.88) translate3d(0, 0, 0)!important;
        -moz-transform: scale(0.88) translate3d(0, 0, 0)!important;
        -ms-transform: scale(0.88) translate3d(0, 0, 0)!important;
        transform: scale(0.88) translate3d(0, 0, 0)!important;
        z-index: 96!important;
        top: 45px!important;
        opacity: 0.76!important;
    }
    .poster-item:nth-child(5) {
        -webkit-transform: scale(0.84) translate3d(0, 0, 0)!important;
        -moz-transform: scale(0.84) translate3d(0, 0, 0)!important;
        -ms-transform: scale(0.84) translate3d(0, 0, 0)!important;
        transform: scale(0.84) translate3d(0, 0, 0)!important;
        z-index: 95!important;
        top: 60px!important;
        opacity: 0.68!important;
    }

.droptop1 {
    -webkit-animation: droptop1 0.7s ease-in-out forwards;
    -moz-animation: droptop1 0.7s ease-in-out forwards;
    -ms-animation: droptop1 0.7s ease-in-out forwards;
    animation: droptop1 0.7s ease-in-out forwards;}
.droptop2 {
    -webkit-animation: droptop2 0.7s ease-in-out forwards;
    -moz-animation: droptop2 0.7s ease-in-out forwards;
    -ms-animation: droptop2 0.7s ease-in-out forwards;
    animation: droptop2 0.7s ease-in-out forwards;}
.droptop3 {
    -webkit-animation: droptop3 0.7s ease-in-out forwards;
    -moz-animation: droptop3 0.7s ease-in-out forwards;
    -ms-animation: droptop3 0.7s ease-in-out forwards;
    animation: droptop3 0.7s ease-in-out forwards;}
.droptop4 {
    -webkit-animation: droptop4 0.7s ease-in-out forwards;
    -moz-animation: droptop4 0.7s ease-in-out forwards;
    -ms-animation: droptop4 0.7s ease-in-out forwards;
    animation: droptop4 0.7s ease-in-out forwards;}
.droptop5 {
    -webkit-animation: droptop5 0.7s ease-in-out forwards;
    -moz-animation: droptop5 0.7s ease-in-out forwards;
    -ms-animation: droptop5 0.7s ease-in-out forwards;
    animation: droptop5 0.7s ease-in-out forwards;}

.dropBottom1 {
    -webkit-animation: dropBottom1 0.7s ease-in-out forwards;
    -moz-animation: dropBottom1 0.7s ease-in-out forwards;
    -ms-animation: dropBottom1 0.7s ease-in-out forwards;
    animation: dropBottom1 0.7s ease-in-out forwards;}
.dropBottom2 {
    -webkit-animation: dropBottom2 0.7s ease-in-out forwards;
    -moz-animation: dropBottom2 0.7s ease-in-out forwards;
    -ms-animation: dropBottom2 0.7s ease-in-out forwards;
    animation: dropBottom2 0.7s ease-in-out forwards;}
.dropBottom3 {
    -webkit-animation: dropBottom3 0.7s ease-in-out forwards;
    -moz-animation: dropBottom3 0.7s ease-in-out forwards;
    -ms-animation: dropBottom3 0.7s ease-in-out forwards;
    animation: dropBottom3 0.7s ease-in-out forwards;}
.dropBottom4 {
    -webkit-animation: dropBottom4 0.7s ease-in-out forwards;
    -moz-animation: dropBottom4 0.7s ease-in-out forwards;
    -ms-animation: dropBottom4 0.7s ease-in-out forwards;
    animation: dropBottom4 0.7s ease-in-out forwards;}
.dropBottom5 {
    -webkit-animation: dropBottom5 0.7s ease-in-out forwards;
    -moz-animation: dropBottom5 0.7s ease-in-out forwards;
    -ms-animation: dropBottom5 0.7s ease-in-out forwards;
    animation: dropBottom5 0.7s ease-in-out forwards;}
    

@-webkit-keyframes droptop1 {
    0% {
        -webkit-transform: scale(1) translate3d(0, 0, 0);
        z-index: 99;
        top: 0px;
        opacity: 1;
    }

    50%{
        top: -10px;
    }

    100% {
        -webkit-transform: scale(0.84) translate3d(0, 0, 0);
        z-index: 95;
        top: 60px;
        opacity: 0.9;
    }
}


@-moz-keyframes droptop1 {
    0% {
        -moz-transform: scale(1) translate3d(0, 0, 0);
        z-index: 99;
        top: 0px;
        opacity: 1;
    }

    50%{
        top: -10px;
    }

    100% {
        -moz-transform: scale(0.84) translate3d(0, 0, 0);
        z-index: 95;
        top: 60px;
        opacity: 0.9;
    }
}

@-ms-keyframes droptop1 {
    0% {
        -ms-transform: scale(1) translate3d(0, 0, 0);
        z-index: 99;
        top: 0px;
        opacity: 1;
    }

    50%{
        top: -10px;
    }

    100% {
        -ms-transform: scale(0.84) translate3d(0, 0, 0);
        z-index: 95;
        top: 60px;
        opacity: 0.9;
    }
}

/* @-o-transforms droptop1 {
    0% {
        -o-transform: scale(1);
        z-index: 99;
        top: 0px;
        opacity: 1;
    }

    50%{
        top: -10px;
    }

    100% {
        -o-transform: scale(0.84);
        z-index: 95;
        top: 60px;
        opacity: 0.9;
    }
} */

@keyframes droptop1 {
    0% {
        transform: scale(1) translate3d(0, 0, 0);
        z-index: 99;
        top: 0px;
        opacity: 1;
    }

    50%{
        top: -10px;
    }

    100% {
        transform: scale(0.84) translate3d(0, 0, 0);
        z-index: 95;
        top: 60px;
        opacity: 0.9;
    }
}


@-webkit-keyframes droptop2 {
    0% {
        -webkit-transform: scale(0.96) translate3d(0, 0, 0);
        z-index: 98;
        top: 15px;
        opacity: 1;
    }

    100% {
        -webkit-transform: scale(1) translate3d(0, 0, 0);
        z-index: 99;
        top: 0px;
        opacity: 1;
    }
}


@-moz-keyframes droptop2 {
    0% {
        -moz-transform: scale(0.96) translate3d(0, 0, 0);
        z-index: 98;
        top: 15px;
        opacity: 1;
    }

    100% {
        -moz-transform: scale(1) translate3d(0, 0, 0);
        z-index: 99;
        top: 0px;
        opacity: 1;
    }
}

@-ms-keyframes droptop2 {
    0% {
        -ms-transform: scale(0.96) translate3d(0, 0, 0);
        z-index: 98;
        top: 15px;
        opacity: 1;
    }

    100% {
        -ms-transform: scale(1) translate3d(0, 0, 0);
        z-index: 99;
        top: 0px;
        opacity: 1;
    }
}
    
@keyframes droptop2 {
    0% {
        transform: scale(0.96) translate3d(0, 0, 0);
        z-index: 98;
        top: 15px;
        opacity: 1;
    }

    100% {
        transform: scale(1) translate3d(0, 0, 0);
        z-index: 99;
        top: 0px;
        opacity: 1;
    }
}

@-webkit-keyframes droptop3 {
    0% {
        -webkit-transform: scale(0.92) translate3d(0, 0, 0);
        z-index: 97;
        top: 30px;
        opacity: 0.84;
    }

    100% {
        -webkit-transform: scale(0.96) translate3d(0, 0, 0);
        z-index: 98;
        top: 15px;
        opacity: 0.92;
    }
}


@-moz-keyframes droptop3 {
    0% {
        -moz-transform: scale(0.92) translate3d(0, 0, 0);
        z-index: 97;
        top: 30px;
        opacity: 0.84;
    }

    100% {
        -moz-transform: scale(0.96) translate3d(0, 0, 0);
        z-index: 98;
        top: 15px;
        opacity: 0.92;
    }
}

@-ms-keyframes droptop3 {
    0% {
        -ms-transform: scale(0.92) translate3d(0, 0, 0);
        z-index: 97;
        top: 30px;
        opacity: 0.84;
    }

    100% {
        -ms-transform: scale(0.96) translate3d(0, 0, 0);
        z-index: 98;
        top: 15px;
        opacity: 0.92;
    }
}

@keyframes droptop3 {
    0% {
        transform: scale(0.92) translate3d(0, 0, 0);
        z-index: 97;
        top: 30px;
        opacity: 0.84;
    }

    100% {
        transform: scale(0.96) translate3d(0, 0, 0);
        z-index: 98;
        top: 15px;
        opacity: 0.92;
    }
}


@-webkit-keyframes droptop4 {
    0% {
        -webkit-transform: scale(0.88) translate3d(0, 0, 0);
        z-index: 96;
        top: 45px;
        opacity: 0.76;
    }

    100% {
        -webkit-transform: scale(0.92) translate3d(0, 0, 0);
        z-index: 97;
        top: 30px;
        opacity: 0.84;
    }
}


@-moz-keyframes droptop4 {
    0% {
        -moz-transform: scale(0.88) translate3d(0, 0, 0);
        z-index: 96;
        top: 45px;
        opacity: 0.76;
    }

    100% {
        -moz-transform: scale(0.92) translate3d(0, 0, 0);
        z-index: 97;
        top: 30px;
        opacity: 0.84;
    }
}

@-ms-keyframes droptop4 {
    0% {
        -ms-transform: scale(0.88) translate3d(0, 0, 0);
        z-index: 96;
        top: 45px;
        opacity: 0.76;
    }

    100% {
        -ms-transform: scale(0.92) translate3d(0, 0, 0);
        z-index: 97;
        top: 30px;
        opacity: 0.84;
    }
}

@keyframes droptop4 {
    0% {
        transform: scale(0.88) translate3d(0, 0, 0);
        z-index: 96;
        top: 45px;
        opacity: 0.76;
    }

    100% {
        transform: scale(0.92) translate3d(0, 0, 0);
        z-index: 97;
        top: 30px;
        opacity: 0.84;
    }
}


@-webkit-keyframes droptop5 {
    0% {
        -webkit-transform: scale(0.84) translate3d(0, 0, 0);
        z-index: 95;
        top: 60px;
        opacity: 0.68;
    }

    100% {
        -webkit-transform: scale(0.88) translate3d(0, 0, 0);
        z-index: 96;
        top: 45px;
        opacity: 0.76;
    }
}


@-moz-keyframes droptop5 {
    0% {
        -moz-transform: scale(0.84) translate3d(0, 0, 0);
        z-index: 95;
        top: 60px;
        opacity: 0.68;
    }

    100% {
        -moz-transform: scale(0.88) translate3d(0, 0, 0);
        z-index: 96;
        top: 45px;
        opacity: 0.76;
    }
}

@-ms-keyframes droptop5 {
    0% {
        -ms-transform: scale(0.84) translate3d(0, 0, 0);
        z-index: 95;
        top: 60px;
        opacity: 0.68;
    }

    100% {
        -ms-transform: scale(0.88) translate3d(0, 0, 0);
        z-index: 96;
        top: 45px;
        opacity: 0.76;
    }
}

@keyframes droptop5 {
    0% {
        transform: scale(0.84) translate3d(0, 0, 0);
        z-index: 95;
        top: 60px;
        opacity: 0.68;
    }

    100% {
        transform: scale(0.88) translate3d(0, 0, 0);
        z-index: 96;
        top: 45px;
        opacity: 0.76;
    }
}


@-webkit-keyframes dropBottom1 {
    0% {
        -webkit-transform: scale(1) translate3d(0, 0, 0);
        z-index: 99;
        top: 0px;
        opacity: 1;
    }

    100% {
        -webkit-transform: scale(0.96) translate3d(0, 0, 0);
        z-index: 98;
        top: 15px;
        opacity: 1;
    }
}


@-moz-keyframes dropBottom1 {
    0% {
        -moz-transform: scale(1) translate3d(0, 0, 0);
        z-index: 99;
        top: 0px;
        opacity: 1;
    }

    100% {
        -moz-transform: scale(0.96) translate3d(0, 0, 0);
        z-index: 98;
        top: 15px;
        opacity: 1;
    }
}

@-ms-keyframes dropBottom1 {
    0% {
        -ms-transform: scale(1) translate3d(0, 0, 0);
        z-index: 99;
        top: 0px;
        opacity: 1;
    }

    100% {
        -ms-transform: scale(0.96) translate3d(0, 0, 0);
        z-index: 98;
        top: 15px;
        opacity: 1;
    }
}

@keyframes dropBottom1 {
    0% {
        transform: scale(1) translate3d(0, 0, 0);
        z-index: 99;
        top: 0px;
        opacity: 1;
    }

    100% {
        transform: scale(0.96) translate3d(0, 0, 0);
        z-index: 98;
        top: 15px;
        opacity: 1;
    }
}

@-webkit-keyframes dropBottom2 {
    0% {
        -webkit-transform: scale(0.96) translate3d(0, 0, 0);
        z-index: 98;
        top: 15px;
        opacity: 1;
    }

    100% {
        -webkit-transform: scale(0.92) translate3d(0, 0, 0);
        z-index: 97;
        top: 30px;
        opacity: 0.84;
    }
}


@-moz-keyframes dropBottom2 {
    0% {
        -moz-transform: scale(0.96) translate3d(0, 0, 0);
        z-index: 98;
        top: 15px;
        opacity: 1;
    }

    100% {
        -moz-transform: scale(0.92) translate3d(0, 0, 0);
        z-index: 97;
        top: 30px;
        opacity: 0.84;
    }
}

@-ms-keyframes dropBottom2 {
    0% {
        -ms-transform: scale(0.96) translate3d(0, 0, 0);
        z-index: 98;
        top: 15px;
        opacity: 1;
    }

    100% {
        -ms-transform: scale(0.92) translate3d(0, 0, 0);
        z-index: 97;
        top: 30px;
        opacity: 0.84;
    }
}

@keyframes dropBottom2 {
    0% {
        transform: scale(0.96) translate3d(0, 0, 0);
        z-index: 98;
        top: 15px;
        opacity: 1;
    }

    100% {
        transform: scale(0.92) translate3d(0, 0, 0);
        z-index: 97;
        top: 30px;
        opacity: 0.84;
    }
}

@-webkit-keyframes dropBottom3 {
    0% {
        -webkit-transform: scale(0.92) translate3d(0, 0, 0);
        z-index: 97;
        top: 30px;
        opacity: 0.84;
    }

    100% {
        -webkit-transform: scale(0.88) translate3d(0, 0, 0);
        z-index: 96;
        top: 45px;
        opacity: 0.76;
    }
}


@-moz-keyframes dropBottom3 {
    0% {
        -moz-transform: scale(0.92) translate3d(0, 0, 0);
        z-index: 97;
        top: 30px;
        opacity: 0.84;
    }

    100% {
        -moz-transform: scale(0.88) translate3d(0, 0, 0);
        z-index: 96;
        top: 45px;
        opacity: 0.76;
    }
}

@-ms-keyframes dropBottom3 {
    0% {
        -ms-transform: scale(0.92) translate3d(0, 0, 0);
        z-index: 97;
        top: 30px;
        opacity: 0.84;
    }

    100% {
        -ms-transform: scale(0.88) translate3d(0, 0, 0);
        z-index: 96;
        top: 45px;
        opacity: 0.76;
    }
}

@keyframes dropBottom3 {
    0% {
        transform: scale(0.92) translate3d(0, 0, 0);
        z-index: 97;
        top: 30px;
        opacity: 0.84;
    }

    100% {
        transform: scale(0.88) translate3d(0, 0, 0);
        z-index: 96;
        top: 45px;
        opacity: 0.76;
    }
}

@-webkit-keyframes dropBottom4 {
    0% {
        -webkit-transform: scale(0.88) translate3d(0, 0, 0);
        z-index: 96;
        top: 45px;
        opacity: 0.76;
    }

    100% {
        -webkit-transform: scale(0.84) translate3d(0, 0, 0);
        z-index: 95;
        top: 60px;
        opacity: 0.68;
    }
}


@-moz-keyframes dropBottom4 {
    0% {
        -moz-transform: scale(0.88) translate3d(0, 0, 0);
        z-index: 96;
        top: 45px;
        opacity: 0.76;
    }

    100% {
        -moz-transform: scale(0.84) translate3d(0, 0, 0);
        z-index: 95;
        top: 60px;
        opacity: 0.68;
    }
}

@-ms-keyframes dropBottom4 {
    0% {
        -ms-transform: scale(0.88) translate3d(0, 0, 0);
        z-index: 96;
        top: 45px;
        opacity: 0.76;
    }

    100% {
        -ms-transform: scale(0.84) translate3d(0, 0, 0);
        z-index: 95;
        top: 60px;
        opacity: 0.68;
    }
}

@keyframes dropBottom4 {
    0% {
        transform: scale(0.88) translate3d(0, 0, 0);
        z-index: 96;
        top: 45px;
        opacity: 0.76;
    }

    100% {
        transform: scale(0.84) translate3d(0, 0, 0);
        z-index: 95;
        top: 60px;
        opacity: 0.68;
    }
}

@-webkit-keyframes dropBottom5 {
    0% {
        -webkit-transform: scale(0.84) translate3d(0, 0, 0);
        z-index: 95;
        top: 60px;
        opacity: 0.68;
    }

    50% {
        top: -5px;
    }

    100% {
        -webkit-transform: scale(1) translate3d(0, 0, 0);
        z-index: 99;
        top: 0px;
        opacity: 1;
    }
}


@-moz-keyframes dropBottom5 {
    0% {
        -moz-transform: scale(0.84) translate3d(0, 0, 0);
        z-index: 95;
        top: 60px;
        opacity: 0.68;
    }

    50% {
        top: -5px;
    }

    100% {
        -moz-transform: scale(1) translate3d(0, 0, 0);
        z-index: 99;
        top: 0px;
        opacity: 1;
    }
}

@-ms-keyframes dropBottom5 {
    0% {
        -ms-transform: scale(0.84) translate3d(0, 0, 0);
        z-index: 95;
        top: 60px;
        opacity: 0.68;
    }

    50% {
        top: -5px;
    }

    100% {
        -ms-transform: scale(1) translate3d(0, 0, 0);
        z-index: 99;
        top: 0px;
        opacity: 1;
    }
}

@keyframes dropBottom5 {
    0% {
        transform: scale(0.84) translate3d(0, 0, 0);
        z-index: 95;
        top: 60px;
        opacity: 0.68;
    }

    50% {
        top: -5px;
    }

    100% {
        transform: scale(1) translate3d(0, 0, 0);
        z-index: 99;
        top: 0px;
        opacity: 1;
    }
}
